<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>修改个人信息</title>
    <style>
        body { font-family: Arial, sans-serif; margin: 0; padding: 0; background-color: #f5f5f5; }
        .container { max-width: 600px; margin: 0 auto; padding: 20px; }
        .header { background-color: #3498db; color: white; text-align: center; padding: 20px; }
        .nav { background-color: #2980b9; overflow: hidden; }
        .nav a { float: left; display: block; color: white; text-align: center; padding: 14px 16px; text-decoration: none; }
        .nav a:hover { background-color: #1abc9c; }
        .footer { background-color: #34495e; color: white; text-align: center; padding: 10px; position: fixed; bottom: 0; width: 100%; }
        
        .card { background-color: white; border-radius: 8px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); margin: 20px 0; padding: 20px; }
        .card h2 { color: #3498db; margin-top: 0; }
        
        .form-group { margin-bottom: 15px; }
        .form-group label { display: block; margin-bottom: 5px; font-weight: bold; }
        .form-group input {width: 100%; padding: 8px; border: 1px solid #ddd; border-radius: 4px;box-sizing: border-box;}
        .form-actions { text-align: right; }
        .btn {display: inline-block;padding: 8px 16px; border-radius: 4px;text-decoration: none;cursor: pointer;border: none;}
        .btn-primary { background-color: #3498db; color: white; }
        .btn-cancel { background-color: #e74c3c; color: white; margin-left: 10px; }
        .btn:hover { opacity: 0.85; }

        .message { padding: 10px; margin-bottom: 15px; border-radius: 4px; }
        .success { background-color: #d4edda; color: #155724; }
        .error { background-color: #f8d7da; color: #721c24; }
    </style>
</head>
<body>
    <div class="header">
        <h1>修改个人信息</h1>
    </div>
    
    <div class="nav">
        <a href="petList">图鉴</a>
        <a href="home">攻略</a>
        <a href="myInfo">我的</a>
    </div>
    
    <div class="container">
        <div class="card">
            <c:if test="${not empty message}">
                <div class="message success">${message}</div>
            </c:if>
            <c:if test="${not empty error}">
                <div class="message error">${error}</div>
            </c:if>
            
            <h2>修改个人信息</h2>
            <form action="${pageContext.request.contextPath}/updateInfo" method="post">
                <input type="hidden" name="account" value="${user.account}">
                
                <div class="form-group">
                    <label>用户名:</label>
                    <input type="text" name="username" value="${user.username}" required>
                </div>
                
                <div class="form-group">
                    <label>密码:</label>
                    <input type="password" name="password" value="${user.password}" required>
                </div>
                
                <div class="form-group">
                    <label>联系方式:</label>
                    <input type="text" name="contact" value="${user.contact}">
                </div>
                
                <div class="form-actions">
                    <button type="submit" class="btn btn-primary">保存修改</button>
                    <a href="${pageContext.request.contextPath}/myInfo" class="btn btn-cancel">取消</a>
                </div>
            </form>
        </div>
    </div>
</body>
</html>